<style include="cr-page-host-style cr-shared-style network-shared
    iron-flex">
  cr-dialog::part(dialog) {
    border-radius: 0;
    height: 100%;
    width: 100%;
  }

  cr-dialog [slot=body] {
    /* This should match or exceed SystemWebDialogDelegate::kDialogHeight
        to ensure the content is stretched to fit. */
    height: 480px;
  }

  .error {
    color: red;
    font-weight: 500;
  }
</style>
<cr-dialog id="dialog" no-cancel>
  <div slot="title">[[getDialogTitle_(type_)]]</div>
  <div slot="body">
    <network-config id="networkConfig" class="flex"
        guid="[[guid_]]" type="{{type_}}"
        enable-connect="{{enableConnect_}}"
        share-allow-enable="[[shareAllowEnable_]]"
        share-default="[[shareDefault_]]"
        error="{{error_}}"
        on-close="close_"
        connect-on-enter>
    </network-config>
  </div>
  <div class="layout horizontal center" slot="button-container">
    <template is="dom-if" if="[[error_]]" restamp>
      <div class="flex error">[[getError_(error_)]]</div>
    </template>
    <cr-button class="cancel-button" on-click="onCancelClick_">
      $i18n{cancel}
    </cr-button>
    <cr-button class="action-button" on-click="onConnectClick_"
        disabled="[[!enableConnect_]]">
      $i18n{networkButtonConnect}
    </cr-button>
  </div>
</cr-dialog>
